import styles from "./auth.module.scss"
import { useNavigate } from "react-router-dom";
import { useAccessStore } from "../../store/access";
import ChangJing from "../../icons/changjing.svg";
import {Button, Input} from "antd";
export function Auth(){
    const access = useAccessStore();
    return (
        <div className={styles["auth-page"]}>
            <ChangJing/>
            <div className={styles["auth-title"]}></div>
            <div className={styles["auth-sub-title"]}>
                <b>(AI对话+抽奖营销平台)</b>
            </div>
            <img
                src="/role/pine_gzh.jpg"
                style={{ width: 250 }}
            />
            <div className={styles["auth-tips"]}>
                <b>扫码关注公众号</b>&nbsp;&nbsp;&nbsp;&nbsp;
                <a
                    href="#"
                    target="_blank"
                >
                    公众号回复【验证码】获取访问验证码
                </a>
            </div>

            <Input
                className={styles["auth-input"]}
                type="password"
                placeholder="在此处填写访问码"
                value={access.accessCode}
                onChange={(e) => {
                    access.updateAccessCode(e.currentTarget.value);
                }}
                status={access.accessCodeErrorMsgs?'error': ''}

            />
            {access.accessCodeErrorMsgs?<span className={styles['auth-error']}>{access.accessCodeErrorMsgs}</span>:null}


            <div className={styles["auth-actions"]}>
                <Button type="primary" onClick={() => access.login()}>确认登录👣</Button>
                <Button type="text">稍后再说</Button>
            </div>

        </div>
    );
}
